<style>
.margin-top0 {margin-top:0}
.hdpradius .carousel-inner {border-radius:0.5rem}
.radius .carousel-inner {border-radius:0.5rem}
</style>
<div id="carousel-container" ng-class="{'carousel slide':1,'margin-top0':pagedata.setting.issearch==1 || pagedata.isa2}" data-role="carousel" data-param-auto="true" ng-if="pagedata.setting.hdps">
	<div class="carousel-inner" role="listbox">
		<div ng-repeat="nav in pagedata.setting.hdps" ng-class="{'item':1, 'active':$index==0}" >
			<a ng-click="access_json(nav.url)">
				<img ng-src="{{tomedia(nav.picurl) || '../core/resource/images/nopic.jpg'}}" style="display: block; width: 100%; height: 100%;">
			</a>
		</div>
	</div>
	<style>
            .fui-swipe-page .fui-swipe-bullet {width:0.2rem;height:0.2rem;border-radius: 0.2rem;}
            .fui-swipe-page .fui-swipe-bullet.active {opacity: 1;width:0.6rem;border-radius: 0.2rem;}
    </style>
	<div id="carousel-jinyun" class="fui-swipe-page" style="padding: 0 0.2rem; bottom: 0.2rem; ">
		<div class="fui-swipe-bullet" ng-repeat="nav in pagedata.setting.hdps" ng-class="{'active':$index==0}" data-target="#carousel-container" data-slide-to="{{$index}}"></div>
	</div>
</div>
<script>
	require(['bootstrap', 'hammer'], function($, Hammer){
		$('#carousel-container').carousel();
		var mc = new Hammer($('#carousel-container').get(0));
		mc.on("panleft", function(ev) {
			$('#carousel-container').carousel('next');
		});
		mc.on("panright", function(ev) {
			$('#carousel-container').carousel('prev');
		});
	});
</script>